<script type="text/x-template" id="template-main_reports">
    <div>
        <el-form class="div-main" :model="form" ref="searchForm" label-width="70px" size="mini">
            <el-row type="flex" justify="space-between">
                <el-col :span="6">
                    <el-form-item  label="报告标题" prop="contentTitle">
                        <el-input v-model="form.contentTitle"
                                  :disabled="false"
                                  :style="{width:  '100%'}"
                                  :clearable="true"
                                  placeholder="请输入报告标题">
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6" style="text-align: right;">
                    <el-button type="primary" icon="el-icon-search" size="mini"
                               @click="form.sqlWhere=null;currentPage=1;list()">查询
                    </el-button>
                    <el-button @click="rest" icon="el-icon-refresh" size="mini">重置</el-button>
                </el-col>
            </el-row>
        </el-form>
        <div class="div-main">
            <el-table v-loading="loading" ref="multipleTable" border :data="dataList"
                      tooltip-effect="dark" @selection-change="handleSelectionChange">
                <el-table-column label="报告标题" align="left" width="500" prop="contentTitle" show-overflow-tooltip>
                </el-table-column>
                <el-table-column label="创建时间" align="center" prop="contentDatetime" :formatter="dateFormat">
                </el-table-column>
                <el-table-column label="作者" align="center" prop="contentAuthor">
                </el-table-column>
                <el-table-column label="发布状态" align="center">
                    <template slot-scope="scope, text">
                        <span v-if="scope.row.sendApply=='1'">待处理</span>
                        <span v-if="scope.row.sendApply=='2'">已通过</span>
                        <span v-if="scope.row.sendApply=='3'">未通过</span>
                        <span v-if="scope.row.sendApply=='4'">已撤回</span>
                        <span v-if="scope.row.sendApply=='5'">未发送</span>
                        <span v-if="scope.row.sendApply=='6'">已发布</span>
                    </template>
                </el-table-column>

            </el-table>
            <el-pagination
                    background
                    :page-sizes="[10,20,30,40,50,100]"
                    layout="total, sizes, prev, pager, next, jumper"
                    :current-page="currentPage"
                    :page-size="pageSize"
                    :total="total"
                    class="ms-pagination"
                    @current-change='currentChange'
                    @size-change="sizeChange">
            </el-pagination>
        </div>
    </div>
</script>
<script>
    var MainMyReports = {
        template: '#template-main_reports',
        data: function () {
            return {
                count: 0,
                tabValue: "1",
                conditions: [],
                contentCategoryIdOptions: [],
                dataList: [],
                //文章列表
                selectionList: [],
                //文章列表选中
                total: 0,
                //总记录数量
                pageSize: 10,
                //页面数量
                currentPage: 1,
                //初始页
                manager: ms.manager,
                loadState: false,
                loading: true,
                //加载状态
                emptyText: '',
                //提示文字
                contentTypeOptions: [],
                contentDisplayOptions: [{
                    "value": "0",
                    "label": "是"
                }, {
                    "value": "1",
                    "label": "否"
                }],
                //搜索表单
                form: {
                    query: 1,
                    sqlWhere: null,
                    // 文章标题
                    contentTitle: null,
                    // 文章类型
                    contentType: null,
                    categoryId: ''
                }
            }
        },
        methods: {
            //查询列表
            list: function () {
                var that = this;
                that.loading = true;
                that.loadState = false;
                var page = {
                    pageNo: that.currentPage,
                    pageSize: that.pageSize
                };
                var form = JSON.parse(JSON.stringify(that.form));

                if (form.contentType != null && form.contentType.length > 0) {
                    form.contentType = form.contentType.join(',');
                }

                for (var key in form) {
                    if (!form[key]) {
                        delete form[key];
                    }
                }

                history.replaceState({
                    form: form,
                    page: page
                }, "");
                //筛选栏目类型，1=列表
                that.form.categoryType = '1';
                ms.http.post(ms.manager + "/cms/content/list.do", form.sqlWhere ? Object.assign({}, {
                    categoryType: '1',
                    sqlWhere: form.sqlWhere
                }, page) : Object.assign({}, form, page)).then(function (res) {
                    if (that.loadState) {
                        that.loading = false;
                    } else {
                        that.loadState = true;
                    }

                    if (!res.result || res.data.total <= 0) {
                        that.emptyText = '暂无数据';
                        that.dataList = [];
                        that.total = 0;
                    } else {
                        that.emptyText = '';
                        that.total = res.data.total;
                        that.dataList = res.data.rows;
                    }
                }).finally(function () {
                    that.loading = false;
                });
                setTimeout(function () {
                    if (that.loadState) {
                        that.loading = false;
                    } else {
                        that.loadState = true;
                    }
                }, 500);
            },
            //文章列表选中
            handleSelectionChange: function (val) {
                this.selectionList = val;
            },
            //表格数据转换
            contentCategoryIdFormat: function (row, column, cellValue, index) {
                var value = "";

                if (cellValue) {
                    var data = this.contentCategoryIdOptions.find(function (value) {
                        return value.id == cellValue;
                    });

                    if (data && data.categoryTitle) {
                        value = data.categoryTitle;
                    }
                }

                return value;
            },
            dateFormat: function (row, column, cellValue, index) {
                if (cellValue) {
                    return ms.util.date.fmt(cellValue, 'yyyy-MM-dd');
                } else {
                    return '';
                }
            },
            contentDisplayFormat: function (row, column, cellValue, index) {
                var value = "";

                if (cellValue) {
                    var data = this.contentDisplayOptions.find(function (value) {
                        return value.value == cellValue;
                    });

                    if (data && data.label) {
                        value = data.label;
                    }
                }

                return value;
            },
            //pageSize改变时会触发
            sizeChange: function (pagesize) {
                this.loading = true;
                this.pageSize = pagesize;
                this.list();
            },
            //currentPage改变时会触发
            currentChange: function (currentPage) {
                this.loading = true;
                this.currentPage = currentPage;
                this.list();
            },
            search: function (data) {
                this.form.sqlWhere = JSON.stringify(data);
                this.list();
            },
            //重置表单
            rest: function () {
                this.form.sqlWhere = null;
                this.$refs.searchForm.resetFields();
                this.list();
            },
            //获取contentCategoryId数据源
            contentCategoryIdOptionsGet: function () {
                var that = this;
                ms.http.get(ms.manager + "/cms/category/list.do", {
                    pageSize: 9999
                }).then(function (res) {
                    if (res.result) {
                        that.contentCategoryIdOptions = res.data.rows;
                    }

                    that.list();
                });
            },
            //获取contentType数据源
            contentTypeOptionsGet: function () {
                var that = this;
                ms.http.get(ms.base + '/mdiy/dict/list.do', {
                    dictType: '文章属性',
                    pageSize: 99999
                }).then(function (data) {
                    if (data.result) {
                        data = data.data;
                        that.contentTypeOptions = data.rows;
                    }
                });
            }
        },
        created: function () {
            this.contentCategoryIdOptionsGet();
            this.contentTypeOptionsGet();
        }
    }
</script>